<template>
  <view class="userLayout">
    <view class="userInfo">
      <view class="avatar">
        <image src="../../static/logo.png" mode="aspectFill"></image>
      </view>
      <view class="ip">
        100.100.100.100
      </view>
      <view class="addrass">
        来自于山东
      </view>
    </view>
    <view class="section">
      <view class="list">
        <view class="row">
          <view class="left">
            <uni-icons type="contact" size=""></uni-icons>
            <view class="text">
              我的下载
            </view>
          </view>
          <view class="right">
            <view class="text">
              33
            </view>
            <uni-icons type="right" size="30"></uni-icons>
          </view>
        </view>
      </view>
    </view>
    <view class="section">
      <view class="list">
        <view class="row">
          <view class="left">
            <uni-icons type="contact" size="30"></uni-icons>
            <view class="text">
              我的下载
            </view>
          </view>
          <view class="right">
            <view class="text">
              33
            </view>
            <uni-icons type="right" size="30"></uni-icons>
          </view>
        </view>
      </view>
    </view>


    {{daysay}}
    {{userinfo}}
  </view>

</template>

<script setup>
  import {
    useApi
  } from '../../api/login';
  import {
    useUserStore
  } from "@/store/user"
  const api = useApi()

  const daysay = ref({})
  const day = async () => {
    const params = {
      key: "a531783a96b249aab2b9954254cdcf74",
      connt: 2
    }
    console.log("11111111111111111", params)
    const data = await api.daysay(params)
    daysay.value = data
  }
  day()



  const {
    userinfo
  } = useUserStore()
  console.log(userinfo)
</script>

<style lang="scss">
  .userLayout {

    .userInfo {
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      padding: 50rpx 0;

      .avatar {
        width: 160rpx;
        height: 160rpx;
        border-radius: 50%;
        overflow: hidden;

        image {
          width: 100%;
          height: 100%;
        }
      }

      .ip {
        font-size: 44rpx;
        color: #333;
        padding: 20rpx 0 5rpx;

      }

      .address {
        font-size: 28rpx;
        color: #333;
      }
    }

    .section {
      width: 690rpx;
      margin: 50rpx auto;
      border: 1px solid #eee;
      border-radius: 10rpx;
      box-shadow: 0 0 30rpx rgba(0, 0, 0, 0.05);

      .list {
        background-color: #fff;

        .row {
          display: flex;
          justify-content: space-between;
          align-items: center;
          padding: 0 30rpx;
          height: 100rpx;
          border-bottom: 1rpx solid #eee;

          &:last-child {
            border-bottom: 0;
          }

          .left {
            display: flex;
            align-items: center;

            .text {
              padding-left: 20rpx;
              color: #666
            }
          }

          .right {
            display: flex;
            align-items: center;

            .text {
              font-size: 28rpx;
              color: #aaa;
            }
          }
        }
      }

    }
  }
</style>